<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>项目管理</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="../css/style.css"/>
</head>
<body>
<div id="wrap">
    <div id="top_content">
        <div id="header">
            <div id="rightheader">
                <p>
                    <span id="welcome"></span>&nbsp;&nbsp;&nbsp;&nbsp;
                    <span><a href="/">退出</a></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <span id="localdate"></span><br/>
                </p>
            </div>
            <div id="topheader">
                <h1 id="title">
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="pyhomepage.html">首页</a>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">报名列表</a>
                </h1>
            </div>
            <div id="navigation"></div>
        </div>
        <div id="content">
            <p id="whereami"></p>
            <h1>运动项目名单</h1>
            <table class="table">
                <thead>
                    <tr class="table_header">
                        <td>ID</td>
                        <td>参报学生</td>
                        <td>性别</td>
                        <td>学生编号</td>
                        <td>专业</td>
                        <td>电话</td>
                        <td>运动项目</td>
                        <td>比赛时间</td>
                        <td>比赛地点</td>
                        <td>操作</td>
                    </tr>
                </thead>
                <tbody id="context"></tbody>
            </table>
        </div>
    </div>
    <div id="footer">
        <div id="footer_bg">ABC@126.com</div>
    </div>
</div>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript">

    let map = {};
    fillCustomMessage();

    $.get({url: "/name?studentId=" + map.id, success(data) {$("#welcome").html("欢迎：<a href='/player/modifyInfo.html'  style='color: #ffffff'>" + data + "</a>")}})


    // 非法用户
    if (null == map.id) {
        alert("用户未登录，请返回登录");
        window.location.href = "/";
    }
    fillEvents();

    // 读取cookie并写入到map
    function fillCustomMessage() {
        let messages = document.cookie.split("; ");
        for (let i = 0; i < messages.length; i++) {
            let ms = messages[i].split("=");
            map[ms[0]] = ms[1];
        }
        $("#footer_bg").text(map.email);
        $("#localdate").text(map.time);
        $("#welcome").text(map.id);

    }

    // 查询报名项目
    function fillEvents() {
        let context = $("#context");
        $.get({
            url: "/event/eventDetails?studentId=" + map.id,
            success(data) {
                context.empty();
                $.each(data.signUpEventsDetails, function (index, element) {
                    console.log(element);
                    context.append("<tr class=" + (index % 2 == 0 ? "row1" : "row2") + ">\n" +
                        "    <td>" + (index + 1) + "</td>\n" +
                        "    <td>" + data.name + "</td>\n" +
                        "    <td>" + data.sex + "</td>\n" +
                        "    <td>" + data.username + "</td>\n" +
                        "    <td>" + data.major + "</td>\n" +
                        "    <td>" + data.phone + "</td>\n" +
                        "    <td>" + element.name + "</td>\n" +
                        "    <td>" + (null == element.time ? "暂未通知" : formatDate(element.time) + "</td>\n" +
                        "    <td>" + (null == element.location ? "暂未通知" : element.location) + "</td>\n" +
                        "    <td>\n" +
                        // "        <a style='color: red' href=# onclick=cancelRegistry(" + map.id + "," +  element.id + ")>取消报名</a>&nbsp;\n" +
                        "        <a style='color: red' href=# onclick=cancelRegistry(" + element.id + ")>取消报名</a>&nbsp;\n" +
                        "    </td>\n" +
                        "</tr>"));
                });
            }
        });

        context.trigger("create");
    }

    // 取消报名
    function cancelRegistry(eventId) {
        if (confirm("确认要取消报名该项目吗？")) {
            $.get({
                url: "/event/cancel?studentId=" + map.id + "&eventId=" + eventId,
                success(data) {
                    console.log(data);
                    fillEvents();
                }
            });
        }
    }

    // 日期格式化
    function formatDate(time) {
        let date = new Date(time);
        let year = date.getFullYear(),
            month = date.getMonth() + 1,//月份是从0开始的
            day = date.getDate(),
            hour = date.getHours(),
            min = date.getMinutes(),
            sec = date.getSeconds();
        var newTime = year + '-' +
            month + '-' +
            day + ' ' +
            hour + ':' +
            min + ':' +
            sec;
        return newTime;
    }
</script>
</body>
</html>



